import { Fragment, defineComponent } from 'vue';
import { http, interfaceUrl } from '@/utils/http';
import { map, navi, poi, url } from '@/store';
import { Dialog as VantDialog } from 'vant';
import { } from './Home.module.scss';
import Fmap from '@/components/fmap/Fmap';
import Vmap, { vmapObj } from '@/components/vmap/Vmap';
import Details from '@/components/details/Details';
import Menu from '@/components/menu/Menu';
import List from '@/components/list/List';
import Search, { searchObj } from '@/components/search/Search';
import RouteInput from '@/components/routeInput/RouteInput';
import Route from '@/components/route/Route';
import ChoiceInput from '@/components/choiceInput/ChoiceInput';
import Path from '@/components/path/Path';
import Nav from '@/components/nav/Nav';


export default defineComponent({
    name: 'Home',
    data() {
        return {
        };
    },
    mounted() {
        // 统计
        // poi.requestStatistics('open');
        // 获取poi分类信息
        poi.requestPoiTypeInfo();
        // 获取poi历史记录
        let temp = localStorage.getItem("historyPoiList");
        if (temp) searchObj.historyList = JSON.parse(temp);
        // 处理url传来的参数
        // this.getUrlQuery();
        // 获取多途径点
        // this.getPathPoints();
    },
    methods: {
        getUrlQuery() {
            // 1：多点导航、2：导航、3：预约导航
            if (url.type == 3) {
                // 终点是座位，不更新定位
                navi.moveLocationFlag = false;

                let timer = setInterval(() => {
                    if (map.analyser) {
                        poi.requestPoiInfo2(url.fid);
                        clearInterval(timer);
                    }
                }, 100);
            }
        },
        getPathPoints() {
            if (url.visit_id > 0) {
                let httpUrl = interfaceUrl + "visit/detail";
                http({
                    url: httpUrl,
                    method: "get",
                    data: {
                        id: url.visit_id,
                    },
                    success(res) {
                        let data = res.data;
                        let voiPoints = [] as any[];
                        data.fidList.forEach((item: any) => {
                            voiPoints.push({
                                x: +item.coordinateX,
                                y: +item.coordinateY,
                                level: +item.floorId,
                                poiName: item.poiName,
                            });
                        });
                        vmapObj.voiDetail = {
                            title: data.visitTitle,
                            voiPoints: voiPoints,
                        }.title = data.visitTitle;
                        vmapObj.isDialog = true;
                    },
                });
            }
        },
        viaCancel() {
            vmapObj.isShow = false;
            vmapObj.isDialog = false;
        },
        viaConfirm() {
            map.menuFlag = false;
            vmapObj.isDialog = false;
            vmapObj.isShow = true;
        }
    },
    render() {
        const { isDialog, voiDetail } = vmapObj;
        return <Fragment>
            {/* 渲染地图 */}
            {vmapObj.isShow ? <Vmap /> : <Fmap />}
            {/* poi详细信息框 */}
            <Details />
            {/* 导航起点终点输入框 */}
            <RouteInput />
            <Route />
            {/* 地图选点框 */}
            <ChoiceInput />
            {/* 导航路径信息 */}
            <Path />
            {/* 导航过程指引信息 */}
            <Nav />
            {/* poi类型菜单 */}
            <Menu />
            {/* poi楼层列表 */}
            <List />
            {/* 搜索详情 */}
            <Search />
            {/* <VantDialog
                show={isDialog}
                width={"70%"}
                showConfirmButton={false}
                showCancelButton={false}
                closeOnClickOverlay={false}
            >
                <div class="dialog-center">
                    <div class="dialog-title">多途径点导航</div>
                    <div>{voiDetail.title}</div>
                    <div class="dialog-btn-group mt30">
                        <div onClick={this.viaCancel} class="dialog-btn-default">取消</div>
                        <div onClick={this.viaConfirm} class="dialog-btn-primary">确定</div>
                    </div>
                </div>
            </VantDialog > */}
        </Fragment >;
    },
});